import React from 'react';
import {
    Card, Col, Row, Button, message, DatePicker,
} from 'antd';
import axios from 'axios';
import intercept from '../../utils/intercept';
import { config } from 'utils';
import './less/common.less';
const {  RangePicker } = DatePicker;

// 更新日志目前为静态渲染数据
export default class OrderInfos extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            loading: false
        }
    };

    componentDidMount() {
    }

    GetDownloadUrl = () => {
        const token = sessionStorage.getItem("token");
        this.setState({ loading: true });
        axios
            .post(`${config.api}CustomService/InsuranceBill`, { startDate: this.startDate, endDate: this.endDate }, { headers: { Authorization: 'Bearer ' + token } })
            .then((data) => {
                // console.log(data)
                if (!data.data.result) {
                    message.warning(data.data.errorMessage)
                }
                else {
                    this.setState({ setdownloadUrl: data.data.downloadUrl });
                    this.refs.download.click();
                }
                this.setState({ loading: false });
            })
            .catch(err => {
                intercept;
            })
    }

    dateChange = (dates, moment) => {
        this.startDate = moment[0];
        this.endDate = moment[1];
    }

    render() {
        return (
            <div className="orderinfo">
                <RangePicker onChange={this.onChange} style={{ marginBottom: 10 }} format="YYYY-MM-DD" onChange={(a, b) => this.dateChange(a, b)} />
                <span style={{ marginLeft: 20 }}>(PS：如果不选择日期或者只选择开始日期，则会默认下载本月账单。)</span>
                <Row gutter={16}>
                    <Col span={6}>
                        <Card style={{ fontSize: 23, textAlign: 'center', height: 220, width: 220 }}>
                            <div>
                                <img style={{ width: 60, height: 60, marginTop: 30 }} src={require('../image/billdownload.png')} />
                                <Button style={{ display: 'block', margin: '0 auto', marginTop: 13 }} type="primary" size="large" loading={this.state.loading} onClick={this.GetDownloadUrl}>下载保险账单</Button>
                                <a style={{ display: "none" }} ref="download" href={this.state.setdownloadUrl}></a>
                            </div>
                        </Card>
                    </Col>
                </Row>
            </div>
        )
    }
}
